<template>
  <div class="clue-container">
    <div class="detail-wrap">
      <!--客户tab按钮筛选-->
      <ul class="tab-wrap-customer">
        <li class="tab-item-customer" @click="tabChange(0)" :class="{current: tabIndex===0}">企业名片</li>
        <li class="tab-item-customer" @click="tabChange(1)" :class="{current: tabIndex===1}">销售机会</li>
        <li class="tab-item-customer" @click="tabChange(2)" :class="{current: tabIndex===2}">合同</li>
      </ul>
      <!--筛选按钮所对应的页面-->
      <ul>
      </ul>
    </div>
  </div>
</template>

<script>
import {} from '@/services/business.service'
import {dateToString, parseAvatar} from '@/core/utils'

export default {
  name: 'CustomerDetail',
  props: {
    'id': String
  },
  data () {
    return {
      // tab页签的切换
      tabIndex: 0
    }
  },
  computed: {},
  watch: {},
  created () {},
  methods: {
    // tab点击事件
    tabChange (index) {
      if (index === 0) {
        this.tabIndex = index
      }
      if (index === 1) {
        this.tabIndex = index
      }
      if (index === 2) {
        this.tabIndex = index
      }
    }
  }
}
</script>

<style lang="stylus" scoped>
  .detail-wrap
    padding 15px
  .card
    background: #fff
    border-radius: 3px
    padding: 10px 0
    margin-bottom: 10px
  .card-hd
    font-size: 16px
    text-indent: 10px
    line-height: 20px
    color: #1AB394
    border-left: 5px solid #1AB394
    margin-bottom: 10px
    i
      float: right
  .card-bd
    border-top: 1px solid #f2f2f2
    padding: 0 15px
    .card-bd-item
      line-height: 25px
      font-size: 12px
      span:first-child
        color:#999
  /*footer*/
  .footer-action
    position: fixed
    bottom: 0
    width: 100%
    height: 45px
    line-height: 45px
    background: #fff
    z-index: 4
    font-size: 16px
    .action-item
      float: left
      width: 50%
      color: #666
      text-align: center
    .highlight
      background: #1AB394
      color: #fff
    .full-item
      width: 100%
      background: #1AB394
      color: #fff
      text-align: center
  .footer-action .four-action-item
    float: left
    width: 25%
    color: #666
    text-align: center
  .footer-action .four-action-item.highlight
    background: #1AB394
    color: #fff
</style>
